   <!-- 原始地址：//webapi.amap.com/ui/1.0/ui/misc/PositionPicker/examples/positionPicker.html -->
    <base href="//webapi.amap.com/ui/1.0/ui/misc/PositionPicker/examples/" />
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <style>
        html,
        body {
            height: 100%;
            margin: 0;
            width: 100%;
            padding: 0;
            overflow: hidden;
            font-size: 13px;
        }
        .map {
            height: 80%;
            width: 100%;
            float: left;
        }
        #right input {
            margin: 4px;
            margin-left: 15px;
        }
        button {
            border: solid 1px;
            margin-left: 15px;
            background-color: #dadafa;
        }
    </style>

<!--<div id="tip">-->
    <!--<input type="text" id="keyword" name="keyword" value="请输入关键字：(选定后搜索)" onfocus='this.value=""'/>-->
<!--</div>-->
<div style="height: 100%" class="main-content">
    <div style="width: 100%; height: 100%;" class="main-content-inner">
        <div id="r-result">请输入地址:<input type="text" id="keyword" name="keyword" onfocus='this.value=""' size="20" value="" style="width:500px;"/>
            纬度 <input type="text" id="lat" name="lat" value="">-
            经度<input type="text" id="lng" name="lng" value="">
        </div>
        <!--<div id="searchResultPanel" style="border:1px solid #C0C0C0;width:250px;height:auto; display:none;"></div>-->
        <div id="container" class="map" tabindex="0"></div>
        <!--<div class="clearfix form-actions">-->
            <div class="col-md-offset-3 col-md-9">
                <button onclick="callback();" class="btn btn-info" type="button">
                    <i class="ace-icon fa fa-check bigger-110"></i>
                    确定选择
                </button>
            </div>
        </div>
</div>
<!--</div>-->
    
<script>
    function callback(){
        parent.<?=$callback;?>($("#lat").val(),$("#lng").val());
    }
</script>
<script type="text/javascript" src='//webapi.amap.com/maps?v=1.3&key=160cab8ad6c50752175d76e61ef92c50&plugin=AMap.ToolBar'></script>
<!-- UI组件库 1.0 -->
<script src="//webapi.amap.com/ui/1.0/main.js"></script>
<script type="text/javascript">
    AMapUI.loadUI(['misc/PositionPicker'], function(PositionPicker) {
        var map = new AMap.Map('container', {
            zoom: 16,
            scrollWheel: false
        })
        var positionPicker = new PositionPicker({
            mode: 'dragMap',
            map: map
        });

        positionPicker.on('success', function(positionResult) {
           $("#keyword").val(positionResult.address);
            var pos = positionResult.position;
            $("#lng").val(pos.lng);
            $("#lat").val(pos.lat);
        });
        positionPicker.on('fail', function(positionResult) {
            //document.getElementById('lnglat').innerHTML = ' ';
            $("#lng").val('');
            $("#lat").val('');
        });
            positionPicker.start(map.getBounds().getSouthWest());
            positionPicker.start();
            map.panBy(0, 1);
        map.addControl(new AMap.ToolBar({
            liteStyle: true
        }))
        AMap.plugin(['AMap.Autocomplete','AMap.PlaceSearch'],function(){
            var autoOptions = {
                city: "上海", //城市，默认全国
                input: "keyword"//使用联想输入的input的id
            };
            autocomplete= new AMap.Autocomplete(autoOptions);
            var placeSearch = new AMap.PlaceSearch({
                city:'北京',
                map:map
            })
            AMap.event.addListener(autocomplete, "select", function(e){
                placeSearch.search(e.poi.name)
            });
        });
        var lng = "<?=$lng?>";
        var lat = "<?=$lat?>";
        //alert(lng);
        if(lng != 0 && lat != 0){
            lnglatXY = [lng, lat];
            var geocoder = new AMap.Geocoder({
                radius: 1000,
                extensions: "all"
            });
            geocoder.getAddress(lnglatXY, function(status, result) {
                if (status === 'complete' && result.info === 'OK') {
                    $("#keyword").val(result.regeocode.formattedAddress);
                }
            });
            var marker = new AMap.Marker({  //加点
                map: map,
                position: lnglatXY
            });
            map.setFitView();
        }

    });
</script>
